<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<%@ taglib prefix="sjg" uri="/struts-jquery-grid-tags"%>

<script type="text/javascript">

    $('fbox_paymentsGrid .ui-reset , #refresh_paymentsGrid').click(function(){
        $("#paymentsGrid").jqGrid('setGridParam',{search:false});
        var postData = $("#paymentsGrid").jqGrid('getGridParam','postData');
        $.extend(postData,{searchField:"",searchString:"",searchOper:""});
        $.extend(postData,{filters:""});
        $("#paymentsGrid").trigger("reloadGrid");
    });

    $.subscribe('searchPaymentsGrid', function(event,data) {
        $("#paymentsGrid").jqGrid('searchGrid', {drag:true,closeAfterSearch:true,closeOnEscape:true,sopt:['eq'],caption:"Search Payments"} );
    });
    
    $.subscribe('paymentsGridComplete',function(event,data){
        $( "#paymentsGrid_search" ).button( "option", "disabled", false );
        $( "#paymentsGrid_showhide" ).button( "option", "disabled", false );

    });
    
    $.subscribe('showhidePaymentsGrid', function(event,data) {
        $("#paymentsGrid").jqGrid('setColumns',{});
    });

</script>
<div class="gridOptsContainer">
    <sj:submit button="true" cssStyle="font-size:14px;" disabled="true" id="paymentsGrid_search" onClickTopics="searchPaymentsGrid" value="Search Payment"/>
    <sj:submit button="true" cssStyle="font-size:14px;" disabled="true" id="paymentsGrid_showhide" onClickTopics="showhidePaymentsGrid" value="Show/Hide Columns"/>

</div>
<s:if test="%{#request['borrowerid'] != null}">
    <s:url id="remoteurl" action="grid-payments">
        <s:param name="borrowerid" value="%{#request['borrowerid']}"/>
    </s:url>
</s:if>
<s:if test="%{#request['borrowerid'] == null}">
    <s:url id="remoteurl" action="grid-payments"/>
</s:if>


<sjg:grid
    id="paymentsGrid"
    caption="Cashmate Payments"
    dataType="json"
    href="%{remoteurl}"
    gridModel="gridModel"
    groupField="['branch']"
    groupColumnShow="[false]"
    groupCollapse="true"
    pagerButtons="true"
    pagerInput="true"
    rowList="10,20,50"
    rowNum="50"
    loadingText="Requesting Data..."
    width="970"
    shrinkToFit="true"
    pager="true"
    hoverrows="true"
    rownumbers="true"
    autoencode="true"
    viewrecords="true"
    navigator="true"
    navigatorAdd="false"
    navigatorDelete="false"
    navigatorEdit="false"
    navigatorSearch="true"
    navigatorView="true"
    onGridCompleteTopics="paymentsGridComplete"
    >

    <sjg:gridColumn name="area"
                    index="area"
                    title="Area Code"
                    search="true"
                    searchoptions="{sopt:['eq']}"
                    sortable="true"
                    align="center"
                    />

    <sjg:gridColumn name="paymentid"
                    index="paymentid"
                    title="Payment id. (Not Editable)"
                    sortable="false"
                    key="true"
                    hidden="true"/>

    <sjg:gridColumn name="date"
                    index="date"
                    title="Collection Date"
                    search="true"
                    sortable="true"
                    searchoptions="{sopt:['eq']}"
                    align="center"
                    />

    <sjg:gridColumn name="completename"
                    index="completename"
                    title="Borrower"
                    search="true"
                    searchoptions="{sopt:['eq']}"
                    sortable="true"
                    align="center"
                    />

    <sjg:gridColumn name="balance"
                    index="balance"
                    title="Balance"
                    search="true"
                    sortable="true"
                    searchoptions="{sopt:['eq']}"
                    align="center"
                    />

    <sjg:gridColumn name="overdue"
                    index="overdue"
                    title="Overdue"
                    search="true"
                    sortable="true"
                    searchoptions="{sopt:['eq']}"
                    align="center"
                    />

    <sjg:gridColumn name="amount"
                    index="amount"
                    title="Amount"
                    search="true"
                    sortable="true"
                    searchoptions="{sopt:['eq']}"
                    align="center"
                    />
    <sjg:gridColumn name="type"
                    index="type"
                    title="Type"
                    search="true"
                    sortable="true"
                    searchoptions="{sopt:['eq']}"
                    align="center"
                    />

    <sjg:gridColumn name="receiptno"
                    index="receiptno"
                    title="Receipt No"
                    search="true"
                    sortable="true"
                    searchoptions="{sopt:['eq']}"
                    align="center"
                    />



    <sjg:gridColumn name="collectionid"
                    index="collectionid"
                    title="Collection Id"
                    search="true"
                    searchoptions="{sopt:['eq']}"
                    sortable="true"
                    align="center"
                    />


    <sjg:gridColumn name="branch"
                    index="branch"
                    title="Branch"
                    search="true"
                    searchoptions="{sopt:['eq']}"
                    sortable="true"
                    align="center"
                    />


</sjg:grid>